.crate-toml-copy {
    button, button:active {
        background-color: #FFFFFF;
        border: none;
        cursor: pointer;
        position: relative;
    }

    .copy-notification {
        font-size: 70%;
        font-weight: bold;
        position: absolute;

        &.copy-success {
            color: $link-color;
        }

        &.copy-failure {
            color: red;
        }
    }

    &.inline {
        display: inline-block;

        button, button:active {
            padding: 0 .2rem;
            outline: 0;

            &:hover {
                background: inherit;
            }

            svg {
                height: 1rem;
                width: 1rem;
            }

            .copy-notification {
                top: -1.25rem;
                left: 0;
                padding: 0;
                text-align: left;
                width: 4rem;

                &.copy-failure {
                    width: 15rem;
                }
            }
        }
    }

    &.block {
        display: flex;

        button, button:active {
            padding: 5px 0;
            width: 60px;
            cursor: pointer;
            position: relative;
        }

        button:hover {
            background: #edebdd;
        }

        .copy-notification {
            &.copy-success {
                width: 100%;
                text-align: center;
            }

            &.copy-failure {
                bottom: -2rem;
                right: 0;
                width: 18rem;
                text-align: right;
            }
        }
    }
}
